<template>
  <!-- 在vue3中单页面里面不需要在强制一个根组件，可以有多个如下 -->
  <div></div>
  <div></div>
  <div @click="open">emits使用方法</div>
</template>
<script>
export default {
  //vue3新增emits用于定义自定义事件,如果定义了一个click自定义事件那么就会和原生事件click冲突事件就会被触发两次，在emits选项中加入click自定义事件，就不会出现触发两次问题
  // emits:['事件名称'],//数组写法
  emits: {
    //对象写法可以加校验
    //   click: null,//click事件没有检验
    open: (value) => {//click事件加检验
      if (value === 1) {
        console.log('校验通过')
      } else {
        console.log('校验不通过')
      }
    },
  },
  setup(props, context) {
    let open = () => {
      context.emit("open", 1);
    };
    return { open };
  },
};
</script>